<script lang="ts" setup>
import { Flex } from 'ant-design-vue'
import backgHelp from '@/common/components/backg-home/backg-help.vue'
import backgCalendar from '@/common/components/backg-home/backg-calendar.vue'
import backgFirm from '@/common/components/backg-home/backg-firm.vue'
import backgNotice from '@/common/components/backg-home/backg-notice.vue'
import backgJump from '@/common/components/backg-home/backg-jump.vue'
</script>
<template>
  <Flex class="home" gap="middle">
    <Flex class="home-left" gap="middle" vertical flex="1">
      <!-- 公司简介 -->
      <backg-firm></backg-firm>
      <!-- 快捷入口 -->
      <backg-jump></backg-jump>
    </Flex>
    <Flex class="home-right" gap="middle" vertical>
      <Flex gap="middle">
        <!-- 帮助链接 -->
        <backg-help></backg-help>
        <!-- 日历 -->
        <backg-calendar></backg-calendar>
      </Flex>
      <!-- 通知公告 -->
      <backg-notice></backg-notice>
    </Flex>
  </Flex>
</template>

<style scoped lang="scss">
.flex-1 {
  flex: 1;
}
.panel {
  padding: 24px;
  background-color: #fff;
}
.gutter-row {
  padding-top: 4px;
}
.gutter-box {
  background: #0092ff;
}

.home {
  &-right {
    width: 600px;
  }
}
</style>
